import React from 'react'
import { connect } from 'react-redux'
import { TopicWrapper, TopicItem, MoreTopic } from '../style'
class Topic extends React.PureComponent {
  render () {
    const { list } = this.props
    return (
      <TopicWrapper>
        {
          list.map((item) => (
            <TopicItem key={item.get('id')}>
              <img
                className="topic-pic"
                src={item.get('imgUrl')}
              />{item.get('title')} 
            </TopicItem>
          ))
        }
        <MoreTopic>热门搜索{'>'} </MoreTopic> 
      </TopicWrapper>
    )
  }
}
const mapStateToProps = (state) => {
  return {
    list: state.get('home').get('topicList')
  }
}
export default connect(mapStateToProps, null)(Topic)